<!DOCTYPE html>

<?php
//Include the default PHP functions
include("../Include/functions.inc.php");

$idEvents = array(); //Array avec les id des évènement courants
$idSalle = array(); //Array avec les id des salles
$index = 0;

//Récupère les derniers évènements
$mesvals = getLastEvents();

//Récupère que les id
while ($row = mysql_fetch_array($mesvals, MYSQL_NUM)) {
    $idEvents[$index] = $row[0];
    $idSalle[$index] = $row[14];
    $index++;
}

//Transforme et affiche les id des event en Array Javascript
echo TojsArray($idEvents, "idEvents");

//Transforme et affiche les id des salles en Array Javascript
echo TojsArray($idSalle, "idSalle");

//Fonction qui transforme un Array PHP en Array Javascript
function TojsArray($lc_values, $nom) {
    $script = "";

    $script = $script . "\n" . '<script type="text/javascript"> ' . "\nvar " . $nom . " = new Array(";
    if (count($lc_values) > 1) {
        foreach ($lc_values as $key => $value) {
            if ($key < (count($lc_values) - 1)) {
                $script = $script . $value . ',';
            } else {
                $script = $script . $value . ");\n";
            }
        }
    } else {  // can't create an array that just has one integer element using Array()
        $script = $script . "1);\nlcValues[0]=" . $lc_values[0] . ";\n";
    }

    return $script . '</script>';
}
?>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1, initial-scale=1.0, user-scalable=no">
        <!--<base href="/" id="ui-base">-->
        <base href=".">
        <meta charset="UTF-8">

        <title>Plan Chateau</title>

        <!Librairie JQuery mobible>
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" />
    <script src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script>
    <script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
    <script src="http://code.jquery.com/jquery-latest.js"></script>

    <link rel="stylesheet" href="Styles/style.css"> 

</head>

<body onLoad="LoadEvent();">
    <div>
        <a id="a2" data-rel="dialog" data-inline="true" data-transition="pop"/>
        <div id="div2" class="div_default_style" style="width:145px; height:170px; left: 39px;
             top: 73px;"></div></a>

    <a id="a1" data-rel="dialog" data-inline="true" data-transition="pop"/>  
    <div id="div1" class="div_default_style" style="left: 234px;
         top: 14px;
         width: 101px;
         height: 163px;"></div></a>

<a id="a3" data-rel="dialog" data-inline="true" data-transition="pop"/>
<div id="div3" class="div_default_style" style="left: 189px;
     top: 179px;
     width: 153px;
     height: 110px;"></div></a>

<a id="a4" data-rel="dialog" data-inline="true" data-transition="pop"/>
<div id="div4" class="div_default_style" style="left: 170px;
     top: 292px;
     width: 101px;
     height: 197px;"></div></a>

<a id="a5" data-rel="dialog" data-inline="true" data-transition="pop"/>
<div id="div5" class="div_default_style" style="left: 273px;
     top: 349px;
     width: 168px;
     height: 141px;"></div></a>

<a id="a7" data-rel="dialog" data-inline="true" data-transition="pop"/>
<div id="div7" class="div_default_style" style="left: 345px;
     top: 174px;
     width: 158px;
     height: 171px;"></div></a>

<a id="a6" data-rel="dialog" data-inline="true" data-transition="pop"/>        
<div id="div6" class="div_default_style" style="left: 444px;
     top: 348px;
     width: 61px;
     height: 157px;"></div></a>

<a id="a8" data-rel="dialog" data-inline="true" data-transition="pop"/>        
<div id="div8" class="div_default_style" style="left: 508px;
     top: 312px;
     width: 134px;
     height: 175px;"></div></a>

<a id="a9" data-rel="dialog" data-inline="true" data-transition="pop"/>        
<div id="div9" class="div_default_style" style="left: 506px;
     top: 159px;
     width: 144px;
     height: 149px;"></div></a>

<a id="a12" data-rel="dialog" data-inline="true" data-transition="pop"/>        
<div id="div12" class="div_default_style" style="left: 646px;
     top: 311px;
     width: 83px;
     height: 182px;"></div></a>

<a id="a13" data-rel="dialog" data-inline="true" data-transition="pop"/>        
<div id="div13" class="div_default_style" style="left: 696px;
     top: 135px;
     width: 124px;
     height: 148px;"></div></a>


<img id="imgBig" src="Pictures/rezBig.png" style="position:absolute; left: 1px; top: 0px; z-index: 1;" usemap="#mapBig"/>


<map name="mapBig">
    <area name="cuisine" alt="cuisine" shape="rect" coords="36,71,184,243" href="#" />
    <area name="cuisine" alt="cuisine" shape="rect" coords="36,71,184,243" href="#" />
    <area name="perron" alt="perron" shape="rect" coords="231,14,334,177" href="#" />
    <area name="office" alt="office" shape="rect" coords="186,178,342,290" href="#" />
    <area name="chambre" alt="chambre" shape="rect" coords="170,290,270,489" href="#" />
    <area name="salleAManger" alt="salle à manger" shape="rect" coords="271,347,440,490" href="#" />
    <area name="bibliotheque" alt="bibliothèque" shape="rect" coords="441,347,505,504" href="#" />
    <area name="hall" alt="hall" shape="rect" coords="343,172,502,345" href="#" />
    <area name="entree" alt="entree" shape="rect" coords="503,157,650,309" href="#" />
    <area name="salon" alt="salon" shape="rect" coords="506,310,642,487" href="#" />
    <area name="veranda" alt="veranda" shape="rect" coords="644,309,728,494" href="#" />
    <area name="bureau" alt="bureau" shape="rect" coords="695,133,820,284" href="#" />
</map>

</div>

<script  LANGUAGE="JavaScript" >
            
    //Fonction appelée au chargeemnt de la page.
    //Va activer les bonnes zones et modifier les href
    function LoadEvent()
    {    
        for (i=0;i<idSalle.length;i++)
        {
            activateZone(idSalle[i], idEvents[i]);
        }
    }
        
    function activateZone(idsale, idevent) {

        var zone = document.getElementById('div' + idsale);
        var link = document.getElementById('a' + idsale);
   
        zone.style.visibility = "visible";

        link.href += 'dialogTest.php?id=' + idevent;
       
        return;
        
    }
            
          
</script>

</body>


</html>